<%
# Copyright (C) 2012 - present Instructure, Inc.
#
# This file is part of Canvas.
#
# Canvas is free software: you can redistribute it and/or modify it under
# the terms of the GNU Affero General Public License as published by the Free
# Software Foundation, version 3 of the License.
#
# Canvas is distributed in the hope that it will be useful, but WITHOUT ANY
# WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
# A PARTICULAR PURPOSE. See the GNU Affero General Public License for more
# details.
#
# You should have received a copy of the GNU Affero General Public License along
# with this program. If not, see <http://www.gnu.org/licenses/>.
%>

<li class="message list-view border border-trbl"
    data-message-id="<%= message.id %>"
    data-secure-id="<%= IncomingMail::ReplyToAddress.new(message).secure_id %>">
    <header>
        <span class="h6"><%= message.subject %></span>

    <span class="label label-<%= message.workflow_state %>">
      <%= message.workflow_state.capitalize %>
    </span>
    </header>

    <div class="tabs">
        <ul>
            <li><a href="#meta-data-<%= message.id %>">{{#t}}Meta Data{{/t}}</a></li>
            <li><a href="#tabs-plain-<%= message.id %>">{{#t}}Plain Text{{/t}}</a></li>
            <li><a href="#tabs-plain-html-<%= message.id %>">HTML</a></li>
        </ul>
        <div id="meta-data-<%= message.id %>">
            <table class="ic-Table ic-Table--condensed grid">
                <tbody>
                <% unless Rails.env.production? %>
                <tr>
                    <td class="td-label"><div>ID</div></td>
                    <td><%= message.id %></td>
                </tr>
                <% end %>
                <tr>
                    <td class="td-label"><div>{{#t}}Subject{{/t}}</div></td>
                    <td><%= message.subject %></td>
                </tr>
                <tr>
                    <td class="td-label"><div>{{#t}}To{{/t}}</div></td>
                    <td><%= message.to %></td>
                </tr>
                <tr>
                    <td class="td-label"><div>{{#t}}From Name{{/t}}</div></td>
                    <td><%= message.from_name %></td>
                </tr>
                <tr>
                    <td class="td-label"><div>{{#t}}Reply to{{/t}}</div></td>
                    <td><span class="message-reply"><%= IncomingMail::ReplyToAddress.new(message).address %></span>
                        (<a class="reply-button" href="#" role="button">{{#t}}Reply{{/t}}</a>)</td>
                </tr>
                <tr>
                    <td class="td-label"><div>{{#t}}Created at{{/t}}</div></td>
                    <td><%= message.created_at %></td>
                </tr>
                <tr>
                    <td class="td-label"><div>{{#t}}Sent at{{/t}}</div></td>
                    <td><%= message.sent_at %></td>
                </tr>
                <tr>
                    <td class="td-label"><div>{{#t}}Delay for{{/t}}</div></td>
                    <td><%= message.delay_for %></td>
                </tr>
                <tr>
                    <td class="td-label"><div>{{#t}}Path type{{/t}}</div></td>
                    <td><%= message.path_type %></td>
                </tr>
                <tr>
                    <td class="td-label"><div>{{#t}}Notification Name{{/t}}</div></td>
                    <td><%= message.notification_name %></td>
                </tr>
                </tbody>
            </table>
        </div>
        <div id="tabs-plain-<%= message.id %>">
            <pre class="message-body"><%= message.body %></pre>
        </div>
        <div id="tabs-plain-html-<%= message.id %>">
            <iframe class="message-html-body" src="<%= user_message_html_message_path(message.user, message) %>" title="{{#t}}Message Body{{/t}}"></iframe>
            <% if message.html_body.present? %>
              <%= link_to "Open in new window", user_message_html_message_path(message.user, message), :target => "_blank", :class => "icon-off small" %>
            <% end %>
        </div>
    </div>
</li>
